<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<title>我的集分</title>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" href="__PUBLIC__/Product/css/page_wodejifen.css">
	<link rel="stylesheet" href="__PUBLIC__/Product/css/lib/animate.css">
	<script src="__PUBLIC__/Product/js/lib/flexible.js"></script>
</head>

<body style="background-color: #f4f4f4;">
	<div class="my_collection_box">
		<!-- 头部 -->
		<div class="my_collection_header">
			<p><img class="goBack" src="__PUBLIC__/Product/img/fanhui.png" /></p>
			<p>我的集分</p>
			<p></p>
		</div>
		<!-- 内容 -->
		<div class="my_collection_content">
			<p class="my_point">集分说明</p>
			<p>当前集分</p>
			<p><span class="myPoint"></span></p>
			<p>集分兑换商品</p>
		</div>
		<div class="my_collection_footer">
			<ul>
				<!-- <li>
					<p>
						<span>通信服务卡充值</span>
						<span>+98</span>
					</p>
					<p>
						<span>2017-03-08</span>
						<span>14:07:29</span>
						<span>剩余集分:198</span>
					</p>
				</li>
				<li>
					<p>
						<span>通信服务卡充值</span>
						<span>-98</span>
					</p>
					<p>
						<span>2017-03-08</span>
						<span>14:07:29</span>
						<span>剩余集分:198</span>
					</p>
				</li>
				<li>
					<p>
						<span>通信服务卡充值</span>
						<span>+98</span>
					</p>
					<p>
						<span>2017-03-08</span>
						<span>14:07:29</span>
						<span>剩余集分:198</span>
					</p>
				</li> -->
			</ul>
		</div>
	</div>
</body>

</html>
<script src="__PUBLIC__/Product/js/lib/jquery3.2.1.js"></script>
<script>
	$(function () {
		$('.my_point').bind('click',function(){
			window.location.href = 'point_explain.html'
		});
		$('.my_collection_content p:nth-child(4)').bind('click',function(){
			window.location.href = 'index.html'
		});
		$('.goBack').click(function(){
    		window.location.href = document.referrer; //返回上一页并刷新
    	});
		loadLi();
		function loadLi() {
			$.ajax({
				url: 'http://a.91jfk.com/Product/Exchange/my_cent',
				type: 'get',
				dataType: 'json',
				success: function (res) {
					console.log(res);
					if (res.code == '1') {
						console.log($('.myPoint'));
						$('.myPoint').text(res.user_details.num);
						var data = res.user_details.list;
						for (var i = 0; i < data.length; i++) {
							if (data[i].num.substring(0,1) == '+') {
								createLiGreen(data[i].name, data[i].num, data[i].time, data[i].rest);
							} else if(data[i].num.substring(0,1) == '-'){
								createLiRed(data[i].name, data[i].num, data[i].time, data[i].rest);
							}
							
						}
					}
				},
				error: function (err) {
					console.log(err);
				}
			});
		}
		function createLiRed(name, num, time, rest) {
			var ul = $('.my_collection_footer ul');
			var con = $('<li><p><span>' + name + '</span><span style="color:#c30d23">' + num + '</span></p><p><span>' + time + '</span><span>剩余集分:' +
				rest + '</span></p></li>');
			ul.append(con);
		}
		function createLiGreen(name, num, time, rest) {
			var ul = $('.my_collection_footer ul');
			var con = $('<li><p><span>' + name + '</span><span style="color:green">' + num + '</span></p><p><span>' + time + '</span><span>剩余集分:' +
				rest + '</span></p></li>');
			ul.append(con);
		}
	});
</script>